import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'

Vue.use(VueRouter)

const routes = [
    {
        // 因为被嵌套的<router-view>是在HomeView中的
        // 所以将在此处理配置嵌套路由
        // 使用children来配置子级路由，children子级的配置方式与routes子级的配置方式相同
        // 通常，应该配置redirect属性，表示重定向，因为一旦发现嵌套，原来的视图（例如HomeView）是不完整的，不应该允许直接访问
        // 以下配置重定向的效果：一旦访问 / 路径，就会自动跳转到 /user/list 路径
        path: '/admin',
        component: HomeView,
        redirect:'/admin/user/list',
        children:[
            {
                path: 'user/list',// 不以 / 作为第1个字符的路径，将与父级路径拼接（不需要关注中间的 / 分隔符）
                component: () =>  import( '../views/user/UserListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---用户列表'
                }
            },
            {
                path: 'user/add-new',
                component: () => import( '../views/user/UserAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加用户'
                }
            },
            {
                path: 'brand/list',
                component: () => import( '../views/brand/BrandListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---品牌列表'
                }
            },
            {
                path: 'brand/add-new',
                component: () => import( '../views/brand/BrandAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加品牌'
                }
            },
            {
                path: 'album/list',
                component: () => import( '../views/album/AlbumListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---相册列表'
                }
            },
            {
                path: 'album/add-new',
                component: () => import( '../views/album/AlbumAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加相册'
                }
            },
            {
                path: 'category/list',
                component: () => import( '../views/category/CategoryListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---类别列表'
                }
            },
            {
                path: 'category/add-new',
                component: () => import( '../views/category/CategoryAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加类别'
                }
            },
            {
                path: 'attribute/list',
                component: () => import( '../views/attribute/AttributeListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---属性列表'
                }
            },
            {
                path: 'attribute/add-new',
                component: () => import( '../views/attribute/AttributeAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加属性'
                }
            },
            {
                path: 'admin/list',
                component: () => import( '../views/admin/AdminListView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---管理员列表'
                }
            },
            {
                path: 'admin/add-new',
                component: () => import( '../views/admin/AdminAddNewView'),
                meta:{
                    title:'酷鲨商城运营管理平台 ---添加管理员'
                }
            }

        ]
    },
    {
        path: '/',
        component: () => import( '../views/LoginView.vue')
    }
]

const router = new VueRouter({
    mode: 'history',
    base: process.env.BASE_URL,
    routes
})

router.beforeEach((to, from,next)=>{
    if(to.meta.title){
    document.title=to.meta.title;
    }
    next()
})

export default router
